<div class="layui-form" lay-filter="form-list" id="form-list" style="padding: 20px 30px 0 0;">
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>所属话题</label>
        <div class="layui-input-block">
            <select name="topic_id" lay-verify="required">
                <option value="">请选择</option>
                {foreach $topic as $k => $v}
                <option value="{$k}" <?=isset($data) && $data['topic_id']==$k?'selected':''?>>{$v}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>标题</label>
        <div class="layui-input-block">
            <input type="text" name="title" lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input" value="{$data['title']|default=''}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>二级标题</label>
        <div class="layui-input-block">
            <input type="text" name="sub_title" lay-verify="required" placeholder="请输入二级标题" autocomplete="off" class="layui-input" value="{$data['sub_title']|default=''}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>封面图片</label>
        <div class="layui-input-block">
            <button type="button" class="layui-btn layui-btn layui-btn-sm" id="test1">上传图片
            </button>
            <input hidden name="image" id="image_src" value="{$data.image|default=''}">
            <div class="layui-upload-list">
                <img class="layui-upload-img" id="test-upload-normal-img" style="width: 120px" src="{$data.image|default=''}">
                <p id="test-upload-demoText"></p>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>作者</label>
        <div class="layui-input-block">
            <select name="doctor_id" lay-verify="required">
                <option value="">请选择</option>
                {foreach $doctor as $k => $v}
                <option value="{$k}" <?=isset($data) && $data['doctor_id']==$k?'selected':''?>>{$v}</option>
                {/foreach}
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>状态</label>
        <div class="layui-input-block">
            <input type="checkbox" name="is_show" lay-skin="switch" lay-text="显示|不显示"  value="1" <?=isset($data) && $data['is_show']==0?'':'checked'?>>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><span class="required">*</span>关联小程序身高报告</label>
        <div class="layui-input-block">
            <input type="checkbox" name="is_report" lay-skin="switch" lay-text="显示|不显示"  value="1" <?=(isset($data) && $data['is_report']==0) || !isset($data)?'':'checked'?>>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">排序</label>
        <div class="layui-input-block">
            <input type="text" name="sort"  placeholder="请输入排序" autocomplete="off" class="layui-input" value="{$data['sort']|default=1}">
        </div>
    </div>
    <div class="layui-col-sm12">
        <div class="layui-form-item">
            <label class="layui-form-label"><span class="required">*</span>文章内容</label>
            <div class="layui-input-block">
<!--                <textarea id="content" style="display: none;" name="content">{$data['content']|default=''}</textarea>-->
                <div id="content">

                </div>

            </div>
        </div>
    </div>

<!--    <div class="layui-col-sm12">-->
<!--        <div class="layui-form-item">-->
<!--            <label class="layui-form-label"><span class="required">*</span>文章内容</label>-->
<!--            <div class="layui-input-block">-->
<!--                <button type="button" class="layui-btn layui-btn layui-btn-sm" id="test2">上传图片-->
<!--                </button>-->
<!--                <input hidden name="content" id="content" value="{$data.content|default=''}">-->
<!--                <div class="layui-upload-list">-->
<!--                    <img class="layui-upload-img" id="content-img" style="width: 120px" src="{$data.content|default=''}">-->
<!--                    <p id="content-demoText"></p>-->
<!--                </div>-->
<!--            </div>-->
<!--        </div>-->
<!--    </div>-->
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="form-submit" id="form-submit" value="确认添加">
        <input type="hidden" name="id" value="{$data['id']|default=''}">
    </div>
</div>
<script type="text/javascript" src="/js/wangEditor.js"></script>
<script>

    //Demo
    layui.use(['form','upload','layer','layedit'], function(){
        var $ = layui.$
            ,form = layui.form
            ,upload = layui.upload
            ,layedit = layui.layedit
            ,layer = layui.layer
            ,content = '{$data["content"]|default=""}';

        const E = window.wangEditor
        const editor = new E('#content')
        editor.create()
        editor.txt.html(content)
        editor.config.uploadImgServer = "/admin/upload/layuiUploads?dir=rich_text"

        // 富文本编辑器
        // layedit.set({
        //     uploadImage: {
        //         url: "{:url('upload/layuiUploads')}" //接口url
        //     }
        // });
        // var content = layedit.build('content');

        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            ,url: "{:url('upload/ajaxUploads')}"
            ,accept: "images"
            ,field: "image"
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#test-upload-normal-img').attr('src', result); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code > 0){
                    return layer.msg('上传失败');
                }else{
                    $('#image_src').val(res.data[0].path)
                }

                //上传成功
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#test-upload-demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                uploadInst.upload();
                });
            }
        });


        // //文章内容上传
        // var uploadInst1 = upload.render({
        //     elem: '#test2'
        //     ,url: "{:url('upload/ajaxUploads')}"
        //     ,accept: "images"
        //     ,field: "content"
        //     ,before: function(obj){
        //         //预读本地文件示例，不支持ie8
        //         obj.preview(function(index, file, result){
        //             $('#content-img').attr('src', result); //图片链接（base64）
        //         });
        //     }
        //     ,done: function(res){
        //         //如果上传失败
        //         if(res.code > 0){
        //             return layer.msg('上传失败');
        //         }else{
        //             $('#content').val(res.data[0].path)
        //         }
        //
        //         //上传成功
        //     }
        //     ,error: function(){
        //         //演示失败状态，并实现重传
        //         var demoText = $('#content-demoText');
        //         demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
        //         demoText.find('.demo-reload').on('click', function(){
        //             uploadInst1.upload();
        //         });
        //     }
        // });

        //监听提交
        form.on('submit(form-submit)', function(data){
            var field = data.field; //获取提交的字段
            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
            // field.content = layedit.getContent(content);
            field.content = editor.txt.html()
            //提交 Ajax 成功后，关闭当前弹层并重载表格
            $.post("{:url('admin/article/save')}",field,function (ret) {
                if (ret.code == 0){
                    layer.msg(ret.msg,{icon:6,time:1000},function () {
                        parent.layui.table.reload('demo'); //重载表格
                        parent.layer.close(index); //再执行关闭
                    })
                }else{
                    layer.msg(ret.msg,{icon:5,time:1000})
                }
            });

            return false;
        });
    });

</script>
